<div class="form">
    <% $form = $this->beginWidget('CActiveForm', array('id' => 'login-form')); %>

    <p class="note">Campos com <span class="required">*</span> são de preenchimento obrigatório</p>

	<div class="row">
        <%=
            $form->labelEx($model, 'email') .
            $form->textField($model, 'email') .
            $form->error($model, 'email');
        %>
	</div>

	<div class="row">
        <%=
            $form->labelEx($model, 'senha') .
            $form->passwordField($model, 'senha', array('minlength' => 8, 'maxlength' => 16)) .
            $form->error($model, 'senha');
        %>
	</div>
    
    <% if(Yii::app()->captcha->isMaxLoginTryExceeded()): %>
        <div class="row captcha">
            <div class="hint">
                <span>Confirme o código abaixo</span>
                <%= sprintf('<img alt="Gerar novo código" title="Gerar novo código" src="%s/%s" class="refresh" data-deg="0">', Yii::app()->request->baseUrl, 'images/refresh.png'); %>
            </div>
            <% $this->widget('CCaptcha'); %>
            <%=
                $form->textField($model, 'verifyCode') .
                $form->error($model, 'verifyCode');
            %>
        </div>
    <% endif; %>
    
	<div class="row buttons">
        <%= CHtml::submitButton('Entrar'); %>
	</div>

    <% $this->endWidget(); %>
</div><!-- form -->

<%
    Yii::app()->clientScript->registerScript('refresh_code', "
        $('body').addClass('login');

        $('.refresh').click(function (e) {
            e.preventDefault();
            var deg = parseInt($(this).attr('data-deg')) + 180;
            $(this).animate({  borderSpacing: deg }, {
                step: function(now, fx) {
                    var rotate = 'rotate(' + now + 'deg)';
                    $(this).css({
                        '-webkit-transform': rotate,
                        '-moz-transform': rotate,
                        'transform': rotate
                    });
                },
                complete: function (){
                   $(this).attr('data-deg', deg);
                },
                queue: false,
                duration: 'slow'
            },'linear');
            $('#yw0_button').click();
        });
        
        $('#content').change(function() {
            centralizeContent();
        });
        
        $(window).resize(function() {
            centralizeContent();
        });
        
        centralizeContent();
        
        function centralizeContent() {
            var content = $('#content'),
                top = 0.5 * ($(window).height() - content.outerHeight()),
                left = 0.5 * ($(window).width() - content.outerWidth());
            
            content.css({top: top, left: left});
        }
    ");
%>